<template>
  <div >
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true"  label-width="68px">
      <el-form-item label="新闻标题" prop="newTitle">
        <el-input
          v-model="queryParams.newTitle"
          placeholder="请输入新闻标题"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="getList">查询</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-col :span="6" v-for="(item, index) in newsList" :key="item" :offset="index/3 ==0 || index/3==1 || 2 || 3 ? 0 : 2" >
      <el-card :body-style="{ padding: '10px' }" style="margin-left: 10px">
        <!--            <img src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png" class="image">-->
        <div v-if="item.newsImage == null">
          <img src="../../../assets/images/bdd.jpg" class="image"/>
        </div>
        <image-preview :src="item.newsImage" class="image"/>
        <div style="padding: 14px;">
          <span>新闻标题：{{item.newTitle}}</span>
          <div class="bottom clearfix">
            <time class="time">发布时间：{{ item.createTime }}</time>
            <el-button type="text" class="button" @click="viewOne(item.newId)">操作按钮</el-button>
          </div>
        </div>
      </el-card>
    </el-col>
  </div>
</template>

<script>
import {listNews} from "@/api/system/news";
export default {
  name: "detailOne",
  data(){
    return {
      newId: this.$route.query.newId,
      queryParams:{},
      newsList:[],
    }
  },
  created() {
    this.getList();
    debugger
  },
  methods: {
    viewOne(id){
      this.$router.push({
        path:'../../news/publishNews/detail',
        query:{
          newId: id
        }
      })
    },
    /** 查询新闻发布管理列表 */
    getList() {
      const self = this
      self.loading = true;
      self.queryParams.newId = self.newId
      listNews(self.queryParams).then(response => {
        self.newsList = response.rows;
        self.total = response.total;
        self.loading = false;
      });
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.queryParams.newTitle = null
    },
  },
}

</script>

<style scoped>
.image {
  height:260px;
  width: 100%;
  display: block;
}
.time {
  font-size: 13px;
  color: #999;
}
.button {
  padding: 0;
  float: right;
}
</style>
